<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="js/d3.v4.min.js"></script>
	</head>
	<body>
		<!-- <p>Apple</p> -->
		<!-- <p id="p2" class="ps">Pear</p> 
		<p class="ps">Banana</p> -->
	</body>
	<script>
	var dataset=[3,6,9]
	var body=d3.select("body")
	var p=body.selectAll("p")
	// update是元素与数据个数完全一致的情况下
	var update=p.data(dataset)
	// update.text(function(d,i){
	// 	return d;
	// })
	// 当元素个数少于数据个数，需要用到enter进行处理
	// var enter=update.enter()
	// enter.append("p").text(function(d,i){
	// 	console.log(d)
	// 	return d;
	// })
	// 当页面中没有元素，会选择一个空集
	var dataset=[10,20,30,40,50];
	var body=d3.select("body");
	body.selectAll("p")//选择一个空集
	.data(dataset)//绑定数据
	.enter()//选择enter部分
	.append("p")//增加p元素
	.text(function(d){//增加内容
	 return d;
	});
	
	
	
	</script>
</html>
